<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>平台登录</title>
    <link rel="stylesheet" href="/order/Order.css">
    <link rel="stylesheet" href="/static/css/reset.css">
    <%--layui css--%>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1981917_g2q5h869bks.css">
    <%--图标--%>
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1972937_ook7ugcj3y.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1981917_sju4mqmd00n.css">
    <link rel="stylesheet" href="http://at.alicdn.com/t/font_1981917_x3ea6209ra.css">

    <style>
        @font-face {
            font-family: 'iconfont';  /* project id 1981917 */
            src: url('//at.alicdn.com/t/font_1981917_mgjp45pk1kb.eot');
            src: url('//at.alicdn.com/t/font_1981917_mgjp45pk1kb.eot?#iefix') format('embedded-opentype'),
            url('//at.alicdn.com/t/font_1981917_mgjp45pk1kb.woff2') format('woff2'),
            url('//at.alicdn.com/t/font_1981917_mgjp45pk1kb.woff') format('woff'),
            url('//at.alicdn.com/t/font_1981917_mgjp45pk1kb.ttf') format('truetype'),
            url('//at.alicdn.com/t/font_1981917_mgjp45pk1kb.svg#iconfont') format('svg');
        }

    </style>
</head>
<body>
<header id="xc-header">
    <div class="xc-header-mid">
        <div class="xc-header-right">
            <a class="xc-header-a" href="">
                <img class="xc-header-img" src="../static/imgs/1.png" alt="" width="203px" height="34px">
            </a>
        </div>
        <div class="xc-header-input">
            <input class="xc-input" type="text" placeholder="搜索旅游地/酒店/旅游">
            <button class="xc-header-btn"><i class="iconfont icon-sousuo1" ></i></button>
        </div>
    </div>
</header>
<div id="xc-banner">
    <div class="xc-banner-mid">
        <ul class="xc-ul-item">
            <li class="xc-item"><a class="xc-a" href="../admin/index.jsp">首页</a></li>
            <li class="xc-item"><a class="xc-a" href="../travel/travel.jsp">旅游</a></li>
            <li class="xc-item"><a class="xc-a" href="../Strategy/Strategy.jsp">攻略</a></li>
            <li class="xc-item"><a class="xc-a" href="../hotel/hotelIndex.jsp">酒店</a></li>
            <li class="xc-item"><a class="xc-a" href="../tickets/BuyingTickets.jsp">购票</a></li>
            <li class="xc-item"><a class="xc-a" href="../order/order.jsp">订单</a></li>
        </ul>

        <div class="xc-banner-right">
            <div class="xc-item"><a class="xc-a" href="../user/indexAddUser.jsp">注册</a></div>
            <div class="xc-item"><a class="xc-a" href="../user/userLogin.jsp">登录</a></div>
        </div>
    </div>
</div>


<div id="xc-content">
    <div class="xc-content-box">
        <!--//左边框-->
        <div class="xc-laia">
            <ul class="xc-laib">
                <li class="xc-laibc"><a class="select" href="../admin/index.jsp">
                    <div>我的携程首页</div>
                </a></li>
                <li class="xc-laibc"><a href="../order/order.jsp"><div>订单</div></a></li>
                <li class="xc-laibc"><a href="https://my.ctrip.com/message/message/messagelist.aspx"><div>我的消息</div></a></li>
                <li class="xc-laibc"><a href="https://secure.ctrip.com/webwallet/index"><div >钱包 </div></a></li>
                <li class="xc-laibc"><a href="https://smarket.ctrip.com/promocode/index.html"><div>优惠卷 </div></a></li>
                <li class="xc-laibc"><a href="https://sinfo.ctrip.com/MyInfo/AccountCenter/MineMileage.aspx"><div>积分</div></a></li>
                <li class="xc-laibc"><a href="https://my.ctrip.com/favorite/myfav"><div>我的收藏</div></a></li>
                <li class="xc-laibc"><a href="https://my.ctrip.com/einvoice/EInvoice.aspx"><div>我的发票</div></a></li>
                <li class="xc-laibc"><a href="https://my.ctrip.com/home/passenger/passengerList"><div>常用信息 </div></a></li>
                <li class="xc-laibc"><a href="https://sinfo.ctrip.com/MyInfo/AccountCenter/UserInfoUpdate.aspx"><div>个人中心 </div></a></li>
            </ul>
        </div>
        <!--//中边框-->
        <div class="xc-laiaa">
            <div class="xc-laiaa-box">
                <div class="xc-laiab">
                    <div class="xc-laiab-massage">
                        <div class="xc-laiab-massage-box">
                            <div class="xc-laiab-massage-box-tuzimassage">
                                <div><img width="80" src="/order/image/头像.png" alt=""></div>
                                <ul class="xc-laiab-massage-box-tuzimassage-ul">
                                    <li class="xc-laiab-massage-box-tuzimassage-li-big">
                                        <a href="../user/userLogin.jsp">尊敬的会员</a>
                                    </li>
                                    <li class="xc-laiab-massage-box-tuzimassage-li-small"> 领会员福利></li>
                                </ul>
                            </div>
                            <div>
                                <div><img width="70" src="/order/image/邮箱.png" alt=""></div>
                            </div>
                        </div>
                    </div>
                    <div class="xc-laiab-lipin">
                        <ul class="xc-laiab-lipin-box">
                            <li class="xc-laiab-lipin-li">
                                <div class="title">礼品卡</div>
                                <div class="money"><i class="iconfont icon-money"></i>0</div>
                                <div class="spilt"></div>
                                <div class="buy">购买</div>
                            </li>
                            <li class="xc-laiab-lipin-li">
                                <div class="title">现金</div>
                                <div class="money"><i class="iconfont icon-money"></i>0</div>
                                <div class="spilt"></div>
                            </li>
                            <li class="xc-laiab-lipin-li">
                                <div class="title">返现</div>
                                <div class="money"><i class="iconfont icon-money"></i>0</div>
                                <div class="spilt"></div>
                            </li>
                            <li class="xc-laiab-lipin-li">
                                <div class="title">积分</div>
                                <div class="money">0</div>
                                <div class="spilt"></div>
                            </li>
                            <li class="xc-laiab-lipin-li">
                                <div class="title">优惠卷</div>
                                <div class="money">0</div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="xc-laiac" style="height: 380px">

                    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                        <ul class="layui-tab-title">
                            <li class="layui-this" >全部订单</li>
                            <li >待支付</li>
                            <li>已支付</li>
                        </ul>
                        <div class="layui-tab-content" style="height: 100px;">
                            <div class="layui-tab-item layui-show">
                                <div class="mm-content">
                                    <table class="layui-hide" id="order-list" lay-filter="mm-content"></table>
                                </div>
                            </div>
                            <div class="layui-tab-item">
                                <div class="mm-content">
                                    <table class="layui-hide" id="order-nopay" lay-filter="mm-content"></table>
                                </div>
                            </div>
                            <div class="layui-tab-item">
                                <div class="mm-content">
                                    <table class="layui-hide" id="order-payed" lay-filter="mm-content"></table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <%--                <div class="xc-laiad" >--%>
                <%--                    <div class="xc-laiad-title">--%>
                <%--                        <li class="xc-laiad-title-li">--%>
                <%--                            <div style="color: #4baaec">最新收藏</div>--%>
                <%--                        </li>--%>
                <%--                    </div>--%>
                <%--                    <div class="xc-laiad-imagebox">--%>
                <%--                        <div class="xc-laiad-imagebox-box">--%>
                <%--                            <div><img width="160" src="./image/图标.png" alt=""></div>--%>
                <%--                            <div style="font-size: 20px;">收藏夹空空的，随便逛逛吧，看看有没有喜欢的~</div>--%>
                <%--                        </div>--%>
                <%--                    </div>--%>
                <%--                </div>--%>
                <%--                <div class="xc-laiae">--%>
                <%--                    <div class="xc-laiae-title">--%>
                <%--                        <li class="xc-laiae-title-li">--%>
                <%--                            <div style="color: #4baaec">游览历史</div>--%>
                <%--                        </li>--%>
                <%--                    </div>--%>
                <%--                    <div class="xc-laiae-imagebox">--%>
                <%--                        <div class="xc-laiae-imagebox-box">--%>
                <%--                            <div><img width="160" src="./image/图标.png" alt=""></div>--%>
                <%--                            <div style="font-size: 20px;">足迹空空，随便逛逛吧</div>--%>
                <%--                        </div>--%>
                <%--                    </div>--%>
                <%--                </div>--%>
            </div>
        </div>


        <!--右边框-->
        <div class="xc-laibb">
            <div class="xc-laibb-box">
                <div class="xc-laibc">
                    <div class="xc-laibc-title">
                        <ul class="xc-laibc-title-ul">
                            <li class="xc-laibc-title-li">应用中心</li>
                        </ul>
                    </div>
                    <div class="xc-laibc-content">
                        <ul class="xc-laibc-content-ul">
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe608;</i>
                                </div>
                                <div class="zi">我的特权</div>
                            </li>
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe600;</i>
                                </div>
                                <div class="zi">航班动态</div>
                            </li>
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe64f;</i>
                                </div>
                                <div class="zi">积分兑换</div>
                            </li>
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe70f;</i>
                                </div>
                                <div class="zi">邮件订阅</div>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="xc-laibc">
                    <div class="xc-laibc-title">
                        <ul class="xc-laibc-title-ul">
                            <li class="xc-laibc-title-li">社区</li>
                            <li class="xc-laibc-title-li-two"><a href="">我的社区主页></a></li>
                        </ul>
                    </div>
                    <div class="xc-laibc-content">
                        <ul class="xc-laibc-content-ul">
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe61f;</i>
                                </div>
                                <div class="zi">当地向导</div>
                            </li>
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe653;</i>
                                </div>
                                <div class="zi">攻略问答</div>
                            </li>
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe6af;</i>
                                </div>
                                <div class="zi">精选游记</div>
                            </li>
                            <li class="xc-laibc-content-li">
                                <div>
                                    <i class="iconfont">&#xe612;</i>
                                </div>
                                <div class="zi">分享点评</div>
                            </li>
                        </ul>
                    </div>
                </div>
                <%--                <div class="xc-laibc">--%>
                <%--                    <div style="padding: 25px 20px"><a href=""><img width="225" src="./image/精选会员.png" ></a></div>--%>
                <%--                </div>--%>
                <%--                <div class="xc-laibd">--%>
                <%--                    <div class="xc-laibd-title">--%>
                <%--                        <ul class="xc-laibd-title-ul">--%>
                <%--                            <li class="xc-laibd-title-li">我的会员特权</li>--%>
                <%--                            <li class="xc-laibd-title-li-two"><a href="">更多></a></li>--%>
                <%--                        </ul>--%>
                <%--                    </div>--%>
                <%--                    <div class="xc-laibd-contentfirst">--%>
                <%--                        <div style="padding: 0px 20px"><img width="247.5" src="./image/积分兑换.png" ></div>--%>
                <%--                    </div>--%>
                <%--                    <div class="xc-laibd-contenttwo">--%>
                <%--                        <div class="xc-laibd-contenttwo-title">--%>
                <%--                            <ul class="xc-laibd-contenttwo-ul">--%>
                <%--                                <li class="xc-laibd-contenttwo-li">会员互动</li>--%>
                <%--                            </ul>--%>
                <%--                        </div>--%>
                <%--                        <div class="xc-laibd-contenttwo-conment">--%>
                <%--                            <ul class="xc-laibd-contenttwo-conment-ul">--%>
                <%--                                <li class="xc-laibd-contenttwo-conment-li">会员权益平台</li>--%>
                <%--                                <li class="xc-laibd-contenttwo-conment-li">积分兑换专区</li>--%>
                <%--                            </ul>--%>
                <%--                        </div>--%>
                <%--                        <div class="xc-laibd-contenttwo-title">--%>
                <%--                            <ul class="xc-laibd-contenttwo-ul">--%>
                <%--                                <li class="xc-laibd-contenttwo-li">会员规则</li>--%>
                <%--                            </ul>--%>
                <%--                        </div>--%>
                <%--                        <div class="xc-laibd-contenttwo-conment">--%>
                <%--                            <ul class="xc-laibd-contenttwo-conment-ul">--%>
                <%--                                <li class="xc-laibd-contenttwo-conment-li">会员升级标准</li>--%>
                <%--                                <li class="xc-laibd-contenttwo-conment-li">携程积分规则</li>--%>
                <%--                            </ul>--%>
                <%--                        </div>--%>
                <%--                    </div>--%>
                <%--                </div>--%>
                <div class="xc-laibe" style="height: 190px;margin:5px ">
                    <div style="padding: 15px 30px"><img width="225" src="/order/image/二维码.png" ></div>
                </div>
            </div>
        </div>
    </div>
</div>

<%--行删除按钮--%>
<script type="text/html" id="delete-admin">
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">付款</a>
</script>
<%--jquery--%>
<script src="/static/js/jquery.min.js"></script>
<%--layui js--%>
<script src="/static/layui/layui.all.js"></script>

<script>
    layui.use(['table', 'layer'], function () {
        let table = layui.table;
        let layer = layui.layer;
        table.render({
            elem: '#order-list'
            , url: '/api/order/findOrderList'
            , cols: [[
                {checkbox: true},
                {field: 'order_id', width: 150, title: '订单编号', sort: true},
                {field: 'order_cat', width: 150, title: '订单类型'},
                {field: 'order_pic', width: 150, title: '订单价格'},
                {field: 'order_sta', width: 150, title: '订单状态'},
                {field: 'order_date', width: 150, title: '订单时间'}
            ]]
            , page: true
            , limit: 5
            , limits: [5, 10, 20]
        });

        table.render({
            elem: '#order-nopay'
            , url: '/api/order/findOrderNopay'
            , cols: [[
                {checkbox: true},
                {field: 'order_id', width: 120, title: '订单编号', sort: true},
                {field: 'order_cat', width: 120, title: '订单类型'},
                {field: 'order_pic', width: 120, title: '订单价格'},
                {field: 'order_sta', width: 120, title: '订单状态'},
                {field: 'order_date', width: 120, title: '订单时间'},
                {field: 'right', width: 150, title: '操作', toolbar: '#delete-admin', align: 'center'}
            ]]
            , page: true
            , limit: 5
            , limits: [5, 10, 20]
        });
        table.render({
            elem: '#order-payed'
            , url: '/api/order/findOrderPayed'
            , cols: [[
                {checkbox: true},
                {field: 'order_id', width: 150, title: '订单编号', sort: true},
                {field: 'order_cat', width: 150, title: '订单类型'},
                {field: 'order_pic', width: 150, title: '订单价格'},
                {field: 'order_sta', width: 150, title: '订单状态'},
                {field: 'order_date', width: 150, title: '订单时间'}
            ]]
            , page: true
            , limit: 5
            , limits: [5, 10, 20]

        });
        table.on('tool(mm-content)', function (obj) {
            let data = obj.data; // 获取当前行的数据
            let event = obj.event;// 获取当前行的事件
            // console.log(data)
            // console.log(event)
            // 删除
            if (event === 'del') {
                layer.confirm('付款吗', function (index) {
                    // obj.del(); //删除对应行（tr）的DOM结构
                    // layer.close(index);
                    //向服务端发送删除指令
                    // request ：  /api/admin/delete?aid=1
                    window.location.href = '/api/order/apply?order_id=' + data.order_id; // 模拟一个超链接的请求

                });
            }
            // if (event === 'detail') {
            //     //  url = /api/admin/detail?aid=1
            //     // 默认返回的就是json
            //     $.getJSON('/api/admin/detail', {order_id: data.order_id}, function (data) {
            //         if (data != null) {
            //             // 弹出层
            //             layer.open({
            //                 type: 1,
            //                 title: "用户明细", //不显示标题栏
            //                 closeBtn: true,
            //                 shadeClose: true,
            //                 area: '500px;',
            //                 shade: 0.8,
            //                 id: 'lay_detail', //设定一个id，防止重复弹出
            //                 btnAlign: 'c',
            //                 moveType: 1,//拖拽模式，0或者1
            //                 content: detail,
            //                 success: function (layero, index) {
            //                     // 渲染数据
            //                     $("#mm-detail .user_id").text(data.user_id)
            //                     $("#mm-detail .user_name").text(data.user_name)
            //                     $("#mm-detail .user_password").text(data.user_password)
            //                     $("#mm-detail .user_phone").text(data.user_phone)
            //                     $("#mm-detail .user_email").text(data.user_email)
            //                 }
            //             })
            //         } else {
            //             alert('用户已删除')
            //         }
            //     })
            // }
        });

    });
</script>
</body>
<%--<div id="mm-detail">测试弹出层</div>--%>
</html>
